#include('./header.html',{active:'article', title:'文章管理'})
<div class="row">
    <div class="col-sm-12">
        <!--<h4 class="page-title">文章管理</h4>-->
        <div class="panel panel-primary">
            <div class="panel-heading"><h3 class="panel-title">文章管理</h3></div>
            <div class="panel-body">

                <form id="articleForm" class="form-inline" role="form" novalidate="novalidate">

                    <div class="form-group">
                        <label class="sr-only">文章标题</label>
                        <input type="text" id="title" name="title" class="form-control" placeholder="请输入标题"
                               aria-required="true" value="${title}"/>
                    </div>

                    <div class="form-group">
                        <label class="sr-only">文章标签</label>
                        <input type="text" id="tag" name="tag" class="form-control" placeholder="请输入标签"
                               aria-required="true" value="${tag}"/>
                    </div>

                    <div class="form-group">
                        <label class="sr-only">文章类型</label>
                        <input type="text" id="categorie" name="categorie" class="form-control" placeholder="请输入类型"
                               aria-required="true"  value="${categorie}"/>
                    </div>

                    <button type="submit" class="btn btn-success waves-effect waves-light m-l-10">查询</button>
                    <a href="javascript:void(0)" onclick="clearQuery();" class="btn btn-success waves-effect waves-light m-l-10">清除</a>
                </form>
            </div> <!-- panel-body -->
        </div>
    </div>
    <div class="col-md-12">
        <table class="table table-striped table-bordered">
            <thead>
            <tr>
                <th width="35%">文章标题</th>
                <th width="15%">发布时间</th>
                <th>浏览量</th>
                <th>所属分类</th>
                <th width="8%">发布状态</th>
                <th>操作</th>
            </tr>
            </thead>
            <tbody>
            #for(post : articles.list)
            <tr cid="${post.cid}">
                <td>
                    <a href="/admin/article/${post.cid}">${post.title}</a>
                </td>
                <td>${fmtdate(post.created, 'yyyy-MM-dd HH:mm:ss')}</td>
                <td>${post.hits}</td>
                <td>${post.categories}</td>
                <td>
                    #if(post.status == 'publish')
                    <span class="label label-success">已发布</span>
                    #elseif(post.status == 'draft')
                    <span class="label label-default">草稿</span>
                    #end
                </td>
                <td>
                    <a href="/admin/article/${post.cid}"
                       class="btn btn-primary btn-sm waves-effect waves-light m-b-5"><i
                            class="fa fa-edit"></i> <span>编辑</span></a>
                    <a href="javascript:void(0)" onclick="delPost(${post.cid});"
                       class="btn btn-danger btn-sm waves-effect waves-light m-b-5"><i
                            class="fa fa-trash-o"></i> <span>删除</span></a>
                    <a class="btn btn-warning btn-sm waves-effect waves-light m-b-5" href="${permalink(post)}"
                       target="_blank"><i
                            class="fa fa-rocket"></i> <span>预览</span></a>

                </td>
            </tr>
            #end
            </tbody>
        </table>
        #call pageAdminNav(articles)
    </div>
</div>

#include('./footer.html')

<script src="//cdn.bootcss.com/jquery-validate/1.15.1/jquery.validate.min.js"></script>
<script src="//cdn.bootcss.com/jquery-validate/1.15.1/localization/messages_zh.min.js"></script>

<script type="text/javascript">
    var tale = new $.tale();
    function delPost(cid) {
        tale.alertConfirm({
            title:'确定删除该文章吗?',
            then: function () {
               tale.post({
                   url : '/admin/article/delete',
                   data: {cid: cid},
                   success: function (result) {
                       if(result && result.success){
                           tale.alertOkAndReload('文章删除成功');
                       } else {
                           tale.alertError(result.msg || '文章删除失败');
                       }
                   }
               });
           }
        });
    }

    $('#articleForm').validate({
        submitHandler: function (form) {
            var tag = $("tag").val();
            var categorie = $("categorie").val();
            var title = $("title").val();

            console.log("tag:" + tag + ",categorie:" + categorie + ",title:" + title)

            tale.get({
                url : '/admin/article?page=1&categorie=' + categorie + "&tag=" + tag + "&title=" + title,
                success: function (result) {
                    if(result && result.success){
                        tale.alertOkAndReload('文章查询成功');
                    } else {
                        tale.alertError(result.msg || '文章查询失败');
                    }
                }
            });
        }
    });

    function clearQuery(){
        $("tag").val("");
        $("categorie").val("");
        $("title").val("");

        $.ajax({
            type: 'get',
            url:  '/admin/article?page=1',
            data: {},
            async: false,
            dataType: 'json',
            success: function (result) {
                new $.tale().hideLoading();
                if(result && result.success){
                    tale.alertOkAndReload('文章查询成功');
                } else {
                    tale.alertError(result.msg || '文章查询失败');
                }
            },
            error: function () {
                //
            }
        });

    }
</script>

</body>
</html>